<template>
	<div class="kaoshi">
		<div class="title">"{{ list.name }}"</div>
		<div class="boxes">
			<span decode class="time">开始时间:&nbsp;{{ list.startTime }}&nbsp;&nbsp;结束时间:&nbsp;{{ list.endTime }}</span>
			<div class="boxes-show">
				<div>
					<div>满分</div>
					<div>{{ list.totalScore }}分</div>
				</div>
				<div class="line"></div>
				<div>
					<div>考试时限</div>
					<div>{{ list.examLength }}分钟</div>
				</div>
			</div>

			<div class="base">
				<div>试卷详情</div>
				<span decode>单选题：{{ list.singleNum }}题&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;多选题{{ list.multipleNum }}题</span>
				<div class="message">考试简介：{{ list.content }}</div>
			</div>
		</div>

		<div class="submit" @click="goIn()">进入考试</div>
	</div>
</template>

<script>
import { examInfo } from '../../../../network/api';
export default {
	name: 'getExamination',
	data() {
		return {
			id: '',
			list: {}
		};
	},
	created() {},
	mounted() {
		// 上个页面的参数 id
		// console.log(this.$route.query.id);
		this.id = this.$route.query.id;
		let param = {
			paperId: this.$route.query.id
		};
		examInfo(param).then(res => {
			// console.log(res);
			this.list = res.retData;
		});
	},
	methods: {
		// 开始考试
		goIn() {
			var that = this;
			this.$confirm('开始考试，若未提交就退出，视作交卷，成绩已当前答题为准！！！', '考试须知', {
				confirmButtonText: '确定',
				cancelButtonText: '取消',
				type: 'warning'
			}).then(() => {
					this.$router.push({ path: '/ykt/examination',query: { id: this.id } });
				}).catch(() => {
					this.$message({
						type: 'info',
						message: '已取消'
					});
				});
		}
	}
};
</script>
<style lang="scss" scoped>
.kaoshi {
	width: 350px;
	margin-left: 300px;

	.title {
		font-size: 16px;
		margin: 10px 15px;
	}

	.boxes {
		padding: 10px 15px;
		background-color: #ffffff;
	}

	.time {
		font-size: 12px;
		color: #666666;
		white-space: nowrap;
	}

	.boxes-show {
		margin-top: 15px;
		font-size: 16px;
		font-weight: bold;
		border-bottom: 1px solid #707070;
		text-align: center;
		display: flex;
		justify-content: center;
		align-content: center;
		padding: 10px 0;
		line-height: 180%;
	}
	.line {
		height: 57px;
		border-left: 1px solid #707070;
		margin: 0 30px;
	}
	.base {
		font-size: 14px;
		color: #666666;
		margin: 10px 0;
		line-height: 200%;
	}
	.message {
		border: 1px solid #707070;
		padding: 10px;
		margin-top: 7.5px;
		height: 143px;
	}
	.submit {
		margin: 30px 15px;
		background-color: #cb1c1d;
		color: #ffffff;
		border-radius: 25px;
		padding: 10px;
		text-align: center;
		font-size: 16px;
	}
}
</style>
